<template>
  <!-- 终端报表 -->
  <div class="app-container">
    <div class="app-wrap">
      <search-table ref="table" :table-loading="listLoading" :table-data="dataList" @query="getDataList(true)" @reset="refresh">
        <template v-slot:row>
          <el-form-item label="渠道:" label-width="50px">
            <el-select v-model="listQuery.agent_id" placeholder="请选择渠道" filterable >
              <el-option label="全部" value="" ></el-option>
              <el-option :label="'【'+item.value+'】'+item.label" :value="item.value" v-for="(item, index) in channelData" :key="index"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item  label="日期时间:" label-width="80px">
            <el-date-picker is-range v-model="listQuery.dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" 
            end-placeholder="结束日期" class="full-width-input time-box" :default-time="['00:00:00', '23:59:59']" :clearable="false"></el-date-picker>
          </el-form-item>
        </template>
        <template v-slot:actions>
          <div class="flexDetween">
            <el-button type="info" size="mini" icon="el-icon-refresh" @click="getDataList">刷新</el-button>
            <el-button type="primary" size="mini" icon="el-icon-download" :disabled="!dataList.length" @click="$public.exportTable('终端报表')">导出</el-button> 
          </div>
        </template>
        <template>
          <el-table-column prop="date" label="日期时间" align="center" width="150">
            <template slot-scope="scope">
              <span v-show="!scope.$index">汇总</span>
              <span v-show="scope.$index">{{ scope.row.date }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="agent_id" label="渠道名" align="center" width="200" show-overflow-tooltip>
            <template slot-scope="scope">
              <span v-show="!scope.$index">汇总</span>
              <span v-show="scope.$index"><span v-show="scope.row.agent_id">【{{scope.row.agent_id}}】</span>{{ $public.channelLabel(scope.row.agent_id) }}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="share_url" label="分享链接" width="120">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" :disabled="!scope.row.share_url" @click.stop="shareUrl(scope.row)">分享链接</el-button>
            </template>
          </el-table-column>
          <el-table-column prop="total_active_num" label="总活跃" align="center" width="150"/>
          <el-table-column prop="today_create_person" label="新增注册" align="center" width="150"/>
          <el-table-column prop="today_create_web_person" label="web注册人数(转化率)" align="center" width="160">
          <template slot-scope="scope">
              <div class="flexCenter">
                {{ scope.row.today_create_web_person }} 【<div class="colorRed width60px">{{ scope.row.web_person }}%</div>】
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="today_create_app_person" label="app注册人数" align="center" width="150"/>
          <el-table-column prop="today_install" label="新安装(注册率)" align="center" width="200">
            <template slot-scope="scope">
              <div class="flexCenter">
                {{ scope.row.today_install }} 【<div class="colorRed width60px">{{ scope.row.retention }}%</div>】
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="game_total" label="TP/RM总局数(新注册)" align="center" width="180"/>
          <el-table-column prop="game_num" label="TP/RM平均局数(新注册)" align="center" width="180"/>
          <el-table-column prop="today_bind_phone" label="今日绑定号码人数" align="center" width="150"/>
          <el-table-column prop="today_bind_bank" label="今日绑定银行卡人数" align="center" width="150"/>
          <el-table-column prop="today_new_device" label="今日新设备注册人数" align="center" width="150"/>
          <el-table-column prop="today_pay_money" label="总充值" align="center" width="150"/>
          <el-table-column prop="today_pay_person" label="总充值人数" align="center" width="150"/>
          <el-table-column prop="total_old_person_active_num" label="老用户活跃付费率" align="center" width="200">
            <template slot-scope="scope">
              <div class="flexCenter">
                {{ scope.row.total_old_person_active_num }} 【<div class="colorRed width60px">{{ scope.row.old_retention }}%</div>】
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="old_arpu" label="老用户ap" align="center" width="150"/>
          <el-table-column prop="today_create_pay_money" label="新用户充值金额" align="center" width="150"/>
          <el-table-column prop="today_create_pay_num" label="新用户充值人数(付费率)" align="center" width="200">
            <template slot-scope="scope">
              <div class="flexCenter">
                {{ scope.row.today_create_pay_num }} 【<div class="colorRed width60px">{{ scope.row.new_retention }}%</div>】
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="new_arpu" label="新用户ap" align="center" width="150"/>
          <el-table-column prop="add_bind_parent_total_num" label="新增裂变人数" align="center" width="150"/>
          <el-table-column prop="add_bind_parent_money" label="裂变充值" align="center" width="150"/>
          <el-table-column prop="add_bind_parent_pay_num" label="裂变充值人数(付费率)" align="center" width="200">
            <template slot-scope="scope">
              <div class="flexCenter">
                {{ scope.row.add_bind_parent_pay_num }} 【<div class="colorRed width60px">{{ scope.row.bind_retention }}%</div>】
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="bind_arpu" label="裂变ap" align="center" width="150"/>
          <el-table-column prop="today_cash_money" label="总提款金额" align="center" width="150"/>
          <el-table-column prop="today_cash_person" label="总提款人数" align="center" width="150"/>
          <el-table-column prop="total_charge_lift" label="总充提差" align="center" width="150">
            <template slot-scope="scope">
              <span :class="scope.row.total_charge_lift>0?'colorGre':scope.row.total_charge_lift<0?'colorRed':''">{{ scope.row.total_charge_lift }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="today_create_user_cash_money" label="新用户提款金额" align="center" width="150"/>
          <el-table-column prop="today_create_user_cash_person" label="新用户提款人数" align="center" width="150"/>
          <el-table-column prop="pay_income" label="新用户充提差" align="center" width="150">
            <template slot-scope="scope">
              <span :class="scope.row.pay_income>0?'colorGre':scope.row.pay_income<0?'colorRed':''">{{ scope.row.pay_income }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="pay_user_pay_income" label="付费用户充提差" align="center" width="150">
            <template slot-scope="scope">
              <span :class="scope.row.pay_user_pay_income>0?'colorGre':scope.row.pay_user_pay_income<0?'colorRed':''">{{ scope.row.pay_user_pay_income }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="no_pay_cash_money" label="非付费提款金额" align="center" width="150"/>
          <el-table-column prop="no_pay_cash_person" label="非付费提款人数" align="center" width="150"/>
          <el-table-column prop="recharge_reward" label="赠送充值筹码" align="center" width="150"/>
          <el-table-column prop="send_reward" label="赠送免费筹码" align="center" width="150"/>
          <el-table-column prop="game_tax" label="抽水筹码" align="center" width="150"/>
          <el-table-column prop="game_income" label="系统输赢" align="center" width="150">
            <template slot-scope="scope">
              <span :class="scope.row.game_income>0?'colorGre':'colorRed'">{{ scope.row.game_income }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="game_total_water" label="总下注(有效下注)" align="center" width="150" show-overflow-tooltip>
            <template slot-scope="scope">
              {{ scope.row.game_total_water }}({{ scope.row.game_effective_water }})
            </template>
          </el-table-column>
          <el-table-column prop="today_commission" label="产生佣金" align="center" width="150"/>
          <el-table-column prop="pay_user_amount" label="充值用户剩余总筹码" align="center" width="170"/>
          <el-table-column prop="no_pay_user_amount" label="非充值用户剩余总筹码" align="center" width="170"/>
          <el-table-column prop="pay_user_amount_bonus" label="充值用户剩余奖金" align="center" width="170"/>
          <el-table-column prop="no_pay_user_amount_bonus" label="非充值用户剩余奖金" align="center" width="170"/>
          <el-table-column prop="pay_user_amount_convert" label="充值用户剩余可转换货币" align="center" width="180"/>
          <el-table-column prop="no_pay_user_amount_convert" label="非充值用户可转换货币" align="center" width="170"/>
        </template>
        <template v-slot:footer>
          <pagination :total="currentTotal" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getDataList" />
        </template>
      </search-table>
    </div>
  </div>
</template>

<script>
import {
  throttle
} from '@/utils/index'
import {
  getTerminal
} from '@/api/statistics'
import SearchTable from '@/components/SearchTable'
export default {
  name: 'terminalReport',
  components: {
    SearchTable
  },
  data () {
    return {
      channelData:this.$store.state.commonState.channelDataArray,
      listQuery: {
        page: 1,
        size: 50,
        agent_id:'',
        dateTime: [this.$public.getDateWeek('s',0)+' 00:00:00',this.$public.getDateWeek('e',0)+' 23:59:59'],
        start_time: '',
        end_time: '',
        real_time:[],
        real_time_start: '',
        real_time_end: '',
      },
      listLoading: true,
      dataList: [],
      currentTotal: 0,
    }
  },
  created () {
    // this.getDataList();
  },
  activated(){
    this.channelData=this.$store.state.commonState.channelDataArray
    this.getDataList();
  },
  methods: {
    // 终端报表
    async getDataList (query) {
      let that = this,params=that.listQuery;
      if(query && !query.page){
        params.page=1
        params.size=50
      }
      that.dataList = []
      that.checkedItem = null
      if (params.dateTime && params.dateTime[0] && params.dateTime[1]) {
        params.start_time = that.$public.standardDate(params.dateTime[0])
        params.end_time = that.$public.standardDate(params.dateTime[1])
      }else{
        params.start_time = ''
        params.end_time = ''
      }
      if (params.real_time && params.real_time[0] && params.real_time[1]) {
        params.real_time_start = that.$public.standardDate(params.real_time[0])
        params.real_time_end = that.$public.standardDate(params.real_time[1])
      }else{
        params.real_time_start = ''
        params.real_time_end = ''
      }
      const response = await getTerminal(params)
      if (response.code == 1) {
        if(response.data.list){
          response.data.list.forEach(item=>{
            item.date=item.date.substr(0,10)
            item.today_pay_money=that.$public.mathNumberDivideWan(item.today_pay_money)
            item.today_old_person_pay_money=that.$public.mathNumberDivideWan(item.today_old_person_pay_money)
            item.today_create_pay_money=that.$public.mathNumberDivideWan(item.today_create_pay_money)
            item.add_bind_parent_money=that.$public.mathNumberDivideWan(item.add_bind_parent_money)
            item.today_cash_money=that.$public.mathNumberDivideWan(item.today_cash_money)
            item.today_create_user_cash_money=that.$public.mathNumberDivideWan(item.today_create_user_cash_money)
            item.pay_income=item.today_create_pay_money-item.today_create_user_cash_money
            item.pay_user_pay_income=that.$public.mathNumberDivideWan(item.pay_user_pay_income)

            item.no_pay_cash_money=that.$public.mathNumberDivideWan(item.no_pay_cash_money)
            item.recharge_reward=that.$public.mathNumberDivideWan(item.recharge_reward)
            item.send_reward=that.$public.mathNumberDivideWan(item.send_reward)
            item.game_tax=that.$public.mathNumberDivideWan(item.game_tax)
            item.game_income=that.$public.mathNumberDivideWan(item.game_income)*-1
            item.game_total_water=that.$public.mathNumberDivideWan(item.game_total_water)
            item.today_commission=that.$public.mathNumberDivideWan(item.today_commission)
            item.pay_user_amount=that.$public.mathNumberDivideWan(item.pay_user_amount)
            item.no_pay_user_amount=that.$public.mathNumberDivideWan(item.no_pay_user_amount)
            item.game_effective_water=that.$public.mathNumberDivideWan(item.game_effective_water)
            item.pay_user_amount_bonus=that.$public.mathNumberDivideWan(item.pay_user_amount_bonus)
            item.no_pay_user_amount_bonus=that.$public.mathNumberDivideWan(item.no_pay_user_amount_bonus)
            item.pay_user_amount_convert=that.$public.mathNumberDivideWan(item.pay_user_amount_convert)
            item.no_pay_user_amount_convert=that.$public.mathNumberDivideWan(item.no_pay_user_amount_convert)

            // 网页注册转化率 = web进入游戏人数 / 网页注册总人数 
            if(item.today_create_web_person){
              item.web_person=that.$public.mathNumberDividePercent(item.today_create_web_hall_person,item.today_create_web_person)
            }else{
              item.web_person=that.$public.mathNumberDividePercent(item.today_create_web_hall_person,100)
            }

            // 老用户活跃付费率 = 老用户活跃付费人数 / 老用户活跃人数(今日)
            if(item.total_old_person_active_num){
              item.old_retention=that.$public.mathNumberDividePercent(item.today_old_person_pay_num,item.total_old_person_active_num)
            }else{
              item.old_retention=that.$public.mathNumberDividePercent(item.today_old_person_pay_num,100)
            }
            // 新用户付费率 = 新用户付费人数 / 新用户注册人数(今日)
            if(item.today_create_person){
              item.new_retention=that.$public.mathNumberDividePercent(item.today_create_pay_num,item.today_create_person)
            }else{
              item.new_retention=that.$public.mathNumberDividePercent(item.today_create_pay_num,100)
            }

            // 老用户ap = 老用户收益 / 活跃人数
            if(item.total_old_person_active_num){
              item.old_arpu=that.$public.mathNumberDivide(item.today_old_person_pay_money,item.total_old_person_active_num)
            }else{
              item.old_arpu=item.today_old_person_pay_money
            }

            // 新用户ap = 新用户收益 / 新注册人数
            if(item.today_create_person){
              item.new_arpu=that.$public.mathNumberDivide(item.today_create_pay_money,item.today_create_person)
            }else{
              item.new_arpu=item.today_create_pay_money
            }

            // 裂变付费率 = 裂变付费人数 / 裂变新增人数(今日)
            if(item.add_bind_parent_total_num){
              item.bind_retention=that.$public.mathNumberDividePercent(item.add_bind_parent_pay_num,item.add_bind_parent_total_num)
            }else{
              item.bind_retention=that.$public.mathNumberMultiply(item.add_bind_parent_pay_num,100)
            }

            // 裂变付费ap = 裂变付费 / 新裂变人数
            if(item.add_bind_parent_pay_num){
              item.bind_arpu=that.$public.mathNumberDivide(item.add_bind_parent_money,item.add_bind_parent_pay_num)
            }else{
              item.bind_arpu=item.add_bind_parent_money
            }

            // 注册率 = 新增注册 / 新安装
            if(item.today_install){
              if(that.$public.mathNumberDividePercent(item.today_create_person,item.today_install)>100){
                item.retention=100
              }else{
                item.retention=that.$public.mathNumberDividePercent(item.today_create_person,item.today_install)
              }
            }else{
              item.retention=0
            }
            
            // 总充提差
            item.total_charge_lift=item.today_pay_money-item.today_cash_money
            // TP/RM平均局数 = 局数 / 注册人数
            item.game_total=item.new_user_teen_patti_game_num+'/'+item.new_user_rummy_game_num
            if(item.today_create_person){
              item.game_num=Math.ceil(item.new_user_teen_patti_game_num/item.today_create_person)+'/'+Math.ceil(item.new_user_rummy_game_num/item.today_create_person)
            }else{
              item.game_num='0/0'
            }
          })
          that.dataList = response.data.list
          that.currentTotal = response.data.total
        }
      }else{
        that.$message.error(response.msg)
      }
      that.listLoading = false
    },
    // 分享链接
    shareUrl(row) {
      window.open(row.share_url)
    },
    // 刷新
    refresh: throttle(function () {
      this.listQuery = {
        page: 1,
        size: 50,
        agent_id:'',
        dateTime: [this.$public.getDateWeek('s',0)+' 00:00:00',this.$public.getDateWeek('e',0)+' 23:59:59'],
        start_time: '',
        end_time: '',
        real_time:[],
        real_time_start: '',
        real_time_end: '',
      }
      this.getDataList()
    }, 2000),
  }
}
</script>

<style lang="scss" scoped></style>
